<template>
  <div>
    <admin-form @sendsea="mySearch" @sendlist="getList"></admin-form>
    <admin-table @resetlist="reslist" @sendpage="pageChange" :adminList="adminList" :count="count"></admin-table>
  </div>
</template>

<script>
import { reactive, toRefs } from 'vue'
import adminForm from './adminForm.vue'
import adminTable from './adminTable.vue'
import { getAdmin } from '../../api/admin'
export default {
  components: {
    adminForm,
    adminTable
  },
  setup () {
    const datas = reactive({
      adminList: [],
      pageStart: 1, //
      searchText: '',
      count: 0
    })
    // 子传父页码 触发的函数
    const pageChange = (page) => {
      datas.pageStart = page// 改变当前页码
      getAdmins()// 获取管理员列表
    }
    // 获取管理员数据
    const getAdmins = async () => {
      var res = await getAdmin({
        pageStart: datas.pageStart,
        searchText: datas.searchText
      })
      console.log(res)
      datas.count = res.data.count
      datas.adminList = res.data.list
    }
    // 子传父 触发的事件函数
    const getList = () => {
      getAdmins()
    }
    const reslist = () => {
      getAdmins()
    }
    getAdmins()
    // 搜索
    const mySearch = (seaText) => {
      console.log(seaText)
      datas.searchText = seaText// 接受传来的搜索字段
      getAdmins()
    }
    return {
      mySearch,
      reslist,
      getList,
      ...toRefs(datas),
      getAdmins,
      pageChange
    }
  }
}
</script>

<style>

</style>
